{% include "header.html" %}

<!-- start page -->
<div id="post_container">
  <!-- start edit content -->
   <div>
   <label id="title_label" for="title">Title:</label>
   <input id="title" value="{{post.title}}"/>
   </div>
   <div class="yui-skin-sam">
   <textarea id="post_content" rows="20" cols="80" style="width:960px"></textarea>
   </div>
   <div>
   <button id="save_post">Save</button>
   </div>
  <!-- end edit content -->
  <div style="clear: both;">&nbsp;</div>
</div>

<script>
(function() {
    var Dom = YAHOO.util.Dom,
        Event = YAHOO.util.Event;
    
    var myConfig = {
        height: '300px',
        width: '760px',
        dompath: true,
        focusAtStart: true
    };

    var myEditor = new YAHOO.widget.Editor('post_content', myConfig);
    myEditor._defaultToolbar.buttonType = 'basic';
    myEditor.render();
    
    YAHOO.util.Event.on('save_post', 'click', function() {
	    //Put the HTML back into the text area
	    myEditor.saveHTML(); 
	    //The var html will now have the contents of the textarea
	    var content = myEditor.get('element').value;
	    var title = document.getElementById('title').value;
    	new_post(title, content);
	});
    
})();
</script>
<!-- end page -->

{% include "footer.html" %}